import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_syt/datas/number_extension.dart';
import 'package:flutter_syt/domain/widgets/network_load_image.dart';

class HomeCoverEntity {
  late int time;
  late String title;
  late String linkUrl;
  late String coverUrl;
  late String color;

  HomeCoverEntity();

  factory HomeCoverEntity.create(
    String linkUrl,
    String time,
    String title,
    String coverUrl,
    String color,
  ) {
    return HomeCoverEntity()
      ..time = parseInt(time)
      ..title = title
      ..linkUrl = linkUrl
      ..coverUrl = coverUrl
      ..color = '0xFF$color';
  }
}

class HomeCover extends StatefulWidget {
  final HomeCoverEntity entity;

  HomeCover(this.entity, {Key? key});

  @override
  State<StatefulWidget> createState() => HomeCoverState();
}

class HomeCoverState extends State<HomeCover> {
  @override
  Widget build(BuildContext context) {
    // var width = MediaQuery.of(context).size.width - 30;
    return Container(
      height: 129.w,
      margin: EdgeInsets.only(
        left: 15.w,
        right: 15.w,
      ),
      child: Stack(
        children: [
          Positioned.fill(
              child: ClipRRect(
                  borderRadius: BorderRadius.circular(12),
                  child: NetworkLoadImage.loadNetworkImage(
                    // CachedNetworkImage(
                    // imageUrl:
                    widget.entity.coverUrl,
                    fit: BoxFit.cover,
                  ))),
          Positioned(
              bottom: 0,
              left: 0,
              right: 0,
              child: Visibility(
                  visible: widget.entity.title.replaceAll(' ', '').isNotEmpty,
                  child: Container(
                    // margin: EdgeInsets.symmetric(horizontal: 15),
                    height: 93.w,
                    decoration: BoxDecoration(
                        borderRadius: BorderRadius.only(
                            bottomLeft: Radius.circular(12),
                            bottomRight: Radius.circular(12)),
                        gradient: LinearGradient(
                          colors: [
                            Colors.black.withOpacity(0.28),
                            Colors.black.withOpacity(0.01),
                          ],
                          begin: Alignment.bottomCenter,
                          end: Alignment.topCenter,
                        )),
                  ))),
          Positioned.fill(
            child: Padding(
              // padding: const EdgeInsets.fromLTRB(12, 0, 27, 16),
              padding: const EdgeInsets.only(bottom: 16, left: 12, right: 16),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.end,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    widget.entity.title,
                    maxLines: 1,
                    softWrap: false,
                    overflow: TextOverflow.ellipsis,
                    style: const TextStyle(
                      fontSize: 16,
                      // fontWeight: FontWeight.bold,
                      color: Colors.white,
                    ),
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
    // return Container(
    //   child: Stack(
    //     children: [
    //       // Positioned.fill(
    //       //   child: Column(
    //       //     children: [
    //       //       Container(
    //       //         height: 130,
    //       //         // decoration: BoxDecoration(
    //       //         //   gradient: LinearGradient(
    //       //         //     colors: [
    //       //         //       Color(parseInt(widget.entity.color)),
    //       //         //       Color(parseInt(widget.entity.color)).withOpacity(0.6),
    //       //         //       Color(parseInt(widget.entity.color)).withOpacity(0),
    //       //         //     ],
    //       //         //     begin: Alignment.topCenter,
    //       //         //     end: Alignment.bottomCenter,
    //       //         //   ),
    //       //         ),
    //       //       )
    //       //     ],
    //       //   ),
    //       // ),
    //       Positioned(
    //           child: SafeArea(
    //         child: Container(
    //           width: double.infinity,
    //           margin: EdgeInsets.only(top: kToolbarHeight, left: 15, right: 15),
    //           child: AspectRatio(
    //               aspectRatio: width / 129.0,
    //               child: ClipRRect(
    //                 borderRadius: BorderRadius.circular(12),
    //                 child: CachedNetworkImage(
    //                   imageUrl: widget.entity.coverUrl,
    //                   fit: BoxFit.cover,
    //                 ),
    //               )),
    //         ),
    //       )),
    //       Positioned.fill(
    //           child: Column(
    //         mainAxisAlignment: MainAxisAlignment.end,
    //         children: [
    //           Container(
    //             margin: EdgeInsets.symmetric(horizontal: 15),
    //             height: 93,
    //             decoration: BoxDecoration(
    //                 borderRadius: BorderRadius.only(
    //                     bottomLeft: Radius.circular(12),
    //                     bottomRight: Radius.circular(12)),
    //                 gradient: LinearGradient(
    //                   colors: [
    //                     Colors.black.withOpacity(0.28),
    //                     Colors.black.withOpacity(0.01),
    //                   ],
    //                   begin: Alignment.bottomCenter,
    //                   end: Alignment.topCenter,
    //                 )),
    //           )
    //         ],
    //       )),
    //       Positioned.fill(
    //         child: Padding(
    //           padding: EdgeInsets.fromLTRB(27, 0, 27, 16),
    //           child: Column(
    //             mainAxisAlignment: MainAxisAlignment.end,
    //             crossAxisAlignment: CrossAxisAlignment.start,
    //             children: [
    //               Text(
    //                 '${widget.entity.title}',
    //                 maxLines: 2,
    //                 softWrap: false,
    //                 overflow: TextOverflow.ellipsis,
    //                 style: TextStyle(
    //                   fontSize: 14,
    //                   fontWeight: FontWeight.bold,
    //                   color: Colors.white,
    //                 ),
    //               ),
    //             ],
    //           ),
    //         ),
    //       ),
    //     ],
    //   ),
    // );
  }
}
